<template>
	<view class="app">
		<view class="price-box">
			<text>支付金额</text>
			<text class="price">￥{{all_amount}}</text>
		</view>

		<view class="pay-type-list">
			<view class="type-item b-b">
				<text class="icon yticon icon-weixinzhifu"></text>
				<view class="con">
					<text class="tit">微信支付</text>
					<text>推荐使用微信支付</text>
				</view>
				<view class="iconfont icon-xuanzhong checkbox" @click="check(index)"></view>
			</view>

			<view class="type-item b-b">
				<text class="icon yticon icon-alipay"></text>
				<view class="con"><text class="tit">支付宝支付</text></view>
				<view class="iconfont icon-xuanzhong checkbox checked" @click="check(index1)"></view>
			</view>

			<!-- 			<view class="type-item" >
				<text class="icon yticon icon-erjiye-yucunkuan"></text>
				<view class="con">
					<text class="tit">预存款支付</text>
					<text>可用余额 ¥198.5</text>
				</view>
<view class="iconfont icon-xuanzhong checkbox "></view>
			</view> -->
		</view>

		<text class="mix-btn" @click="getDefaultAddr">确认支付</text>
	</view>
</template>

<script>
export default{
	data(){
		return{
			requt: 'https://4de16698-d9f4-443a-b416-ef1037cce952.bspapp.com/http',
			checked:true,
			all_amount:'',
			orderId:'',
			orderInfo:''
		}
	},
	onLoad(options,all_amount) {
		console.log(options.orderId);
		this.orderId=options.orderId
		this.all_amount=(options.all_amount)
	},
	methods:{
		//支付订单
		getDefaultAddr(){
		
			let token = uni.getStorageSync('token');
			uni.request({
				
				method: 'POST',
				header:{
					token, //自定义请求头信息
					'platform':'app-plus'
				},
				data:{
					pay_type:'alipay',
					orderId:this.orderId
				},
				url: this.requt + '/order/payOrder',
				success: res => {
					console.log(res);
					this.orderInfo=res.data.data.orderInfo
					uni.requestPayment({
					    provider: 'alipay',
					    orderInfo: this.orderInfo, //微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
					    success: function (res) {
					        console.log('success:' + JSON.stringify(res));
							uni.showToast({
								title:'支付成功',
							}),
							uni.navigateTo({
								url:'/pages/money/paySuccess'
							})
					    },
					    fail: function (err) {
					        console.log('fail:' + JSON.stringify(err));
							uni.showToast({
								title:'支付失败'
							})
					    }
					});
				}
			});
		},
	}
}
</script>

<style lang="scss">
.app {
	width: 100%;
}

.price-box {
	background-color: #fff;
	height: 265upx;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 28upx;
	color: #909399;
	text {
		font-size: 36rpx;
	}
	.price {
		font-size: 50upx;
		color: $color1;
		margin-top: 12upx;
		&:before {
			content: '￥';
			font-size: 40upx;
		}
	}
}

.pay-type-list {
	margin-top: 20upx;
	background-color: #fff;
	padding-left: 60upx;

	.type-item {
		height: 120upx;
		padding: 20upx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-right: 60upx;
		font-size: 30upx;
		position: relative;
	}

	.icon {
		width: 100upx;
		font-size: 52upx;
	}
	.icon-erjiye-yucunkuan {
		color: #fe8e2e;
	}
	.icon-weixinzhifu {
		color: #36cb59;
	}
	.icon-alipay {
		color: #01aaef;
	}
	.tit {
		font-size: $font-lg;
		color: $font-color-dark;
		margin-bottom: 4upx;
	}
	.con {
		flex: 1;
		display: flex;
		flex-direction: column;
		font-size: $font-sm;
		color: $font-color-light;
	}
}
.mix-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 630upx;
	height: 80upx;
	margin: 80upx auto 30upx;
	font-size: $font-lg;
	color: #fff;
	background-color: $base-color;
	border-radius: 10upx;
	box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
}

.checkbox {
	color: #d1d1d1;
	font-size: 40upx;
	&.checked {
		color: rgb(250, 67, 106);
	}
}
</style>
